<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <div class="box"></div>
</body>
<script>
  let url1 = 'https://tse1-mm.cn.bing.net/th/id/OIP.RgqPowpqufF78MY_DyZqzgHaJ4?w=182&h=243&c=7&o=5&dpr=1.25&pid=1.7'
  let url2 = 'https://th.bing.com/th/id/R38b16e726e6419effb57259bd51d1e33?rik=MfSQwDLq6CtUgw&riu=http%3a%2f%2fwww.08lr.cn%2fuploads%2fallimg%2f170513%2f1-1F513095126.jpg&ehk=SU9QUWaBnZ9at7F95pWx3TaxKE0tuNR%2f2IHmgeaNc3E%3d&risl=&pid=ImgRaw'
  let url3 = 'https://th.bing.com/th/id/R399f2bf0c4f207e5e2336abb641d502a?rik=RaWJYbOdK0DLDQ&riu=http%3a%2f%2fimg.netbian.com%2ffile%2f20121010%2fa27fd6cc3203cb8853c5c20754b141ad.jpg&ehk=UPjgX4sOUIwSKPpy1nNoYms8eDAtLx7EO8YAxPzBe6w%3d&risl=&pid=ImgRaw'
  let url4 = 'https://img0.baidu.com/it/u=2194302503,949681687&fm=26&fmt=auto&gp=0.jpg'
  let box = document.querySelector('.box')
  function loadImg(url) {
    return new Promise((resolve, reject) => {
      let img = document.createElement('img')
      img.src = url
      box.appendChild(img)
      img.onload = () => {
        resolve(img.width)
      }
    })

  }
  loadImg(url3).then(res => {
    console.log(res);
    return loadImg(url2)
  }).then(res => {
    console.log(res);
    return loadImg(url1)
  }).then(res => {
    console.log(res);
  })


</script>

</html>